<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>用户投票</title>
    <link rel="stylesheet" href="/js/plugin/mui/css/mui.min.css">
    <link rel="stylesheet" href="//at.alicdn.com/t/font_579508_b0ojnp7n81m.css">
    <link rel="stylesheet" href="/css/build/vote.css">

</head>
<body>

<div class="vote-banner">
    <img src="http://12373036.s61i.faiusr.com/2/AD0IrJjzBRACGAAg3O2XywUosJCwoQcwgAU4rAI!640x640.jpg" alt="">
</div>

<div class="vote-title">
    <h2></h2>
    <!--<p class="vote-company">主办方：<span>阿比爸爸</span></p>-->
</div>
<div class="vote-data">
    <div>
        报名人数
        <p id="applyCount"></p>
    </div>
    <div>
        总投票人数
        <p id="voteCount"></p>
    </div>
    <div>
        粉丝参与人数
        <p id="fanCount"></p>
    </div>
</div>
<p class="vote-limit">
    每人每天限投一票
</p>
<ul class="vote-list" id="vote-list">
    <!--<li>-->
    <!--<p class="no">-->
    <!--<span>0001号</span>-->
    <!--<span>李玉刚</span>-->
    <!--</p>-->
    <!--<img src="http://12373036.s61i.faiusr.com/2/AD0IrJjzBRACGAAg3O2XywUosJCwoQcwgAU4rAI!640x640.jpg" alt="">-->
    <!--<p class="vo">-->
    <!--<span>449票</span>-->
    <!--<span>一结束</span>-->
    <!--</p>-->
    <!--</li>-->
    <!--<li>-->
    <!--<p class="no">-->
    <!--<span>0001号</span>-->
    <!--<span>李玉刚</span>-->
    <!--</p>-->
    <!--<img src="http://12373036.s61i.faiusr.com/2/AD0IrJjzBRACGAAg3O2XywUosJCwoQcwgAU4rAI!640x640.jpg" alt="">-->
    <!--<p class="vo">-->
    <!--<span>449票</span>-->
    <!--<span>一结束</span>-->
    <!--</p>-->
    <!--</li>-->
    <!--<li>-->
    <!--<p class="no">-->
    <!--<span>0001号</span>-->
    <!--<span>李玉刚</span>-->
    <!--</p>-->
    <!--<img src="http://12373036.s61i.faiusr.com/2/AD0IrJjzBRACGAAg3O2XywUosJCwoQcwgAU4rAI!640x640.jpg" alt="">-->
    <!--<p class="vo">-->
    <!--<span>449票</span>-->
    <!--<span>一结束</span>-->
    <!--</p>-->
    <!--</li>-->
</ul>

<div class="vote-list-more">
    <button type="button" id="more"
            data-loading-text="加载中"
            class="mui-btn mui-btn-warning mui-btn-outlined">加载更多
    </button>
</div>

<div class="vote-footer vote-footer-apply" id="apply" style="display: none;">
    <i class="iconfont icon-edit"></i>
    <p>去报名</p>
</div>
<div class="vote-footer disabled" id="end" style="display: none;">
    已结束
</div>
<div class="note-info">
    <h3>活动时间</h3>
    <div id="time">
        <p>
            报名时间
        </p>
        <p>
            投票时间
        </p>
    </div>
    <h3>活动简介</h3>
    <div id="brief" class="article">

    </div>
    <h3>活动规则</h3>
    <div id="rules" class="article">

    </div>
</div>
</body>
<script src="/js/plugin/jquery-2.2.4.min.js"></script>
<script src="/js/plugin/template-web.js"></script>
<script src="/js/plugin/mui/js/mui.min.js"></script>
<script src="/js/smartAui.js"></script>
<script src="/js/smartAui.js"></script>
<script src="/js/plugin/layui/layui.js"></script>
<script src="/js/plugin/layer/layer.js"></script>
<script>
    $(function () {

        var account = smartAui.getUrlParam("account");
        var id = smartAui.getUrlParam("voteId");
        var page = 1;
        //投票信息
        $.ajax({
            url: "/front/voteindex/getVoteInfo?account=" + account + "&id=" + id,
            type: "GET",
            success: function (result) {
                if (result.success && result.data) {
                    $(".vote-banner").html('<img src="' + result.data.poster + '" alt="">');
                    $(".vote-title").html('<h2>' + result.data.name + '</h2>');
                    $("#brief").html(result.data.brief);
                    $("#rules").html(result.data.rules);
                    $("#applyCount").html(result.data.applyCount ? result.data.applyCount : 0);
                    $("#voteCount").html(result.data.voteCount ? result.data.voteCount : 0);
                    $("#fanCount").html(result.data.fanCount ? result.data.fanCount : 0);

                    if (result.data.voteState == 0) {
                        window.state = 0;
//                        $("#end").text("未开始").show();
                    } else if (result.data.voteState == 1) {
                        window.state = 1;
//                        $("#apply").show().click(function () {
////                            location.href = "apply.html?account=" + smartAui.getUrlParam("account") + "&voteId=" + smartAui.getUrlParam("voteId");
//                            location.href = result.data.applyUrl;
//                        });
                    } else {
                        window.state = 2;
//                        $("#end").show();
                    }

                    if (result.data.applyState==0) {
                        $("#end").text("报名未开始").show();
                    } else if (result.data.applyState==1) {
                        if(result.data.personalApplyState==0){// 0 未报名 1 已报名
                            $("#apply").show().click(function () {
//                            location.href = "apply.html?account=" + smartAui.getUrlParam("account") + "&voteId=" + smartAui.getUrlParam("voteId");
                                location.href = result.data.applyUrl;
                            });
                        }else{
                            $("#apply").show().children("p").text("已报名");
                        }
                    } else {
                        $("#end").text("报名已结束").show();
                    }
                    $("#time").html(
                        '<p>报名时间: ' + result.data.signUpStartTime + ' - ' + result.data.signUpEndTime + '</p>'
                        + '<p>投票时间: ' + result.data.voteStartTime + ' - ' + result.data.voteEndTime + '</p>'
                    );
                    getVoteList();
                }
            }
        });
        //选手列表


        $("#more").click(function () {
            var ele = this;
            mui(ele).button('loading');//切换为loading状态
            page++;
            getVoteList();
        });


        function getVoteList() {
            $.ajax({
                url: "/front//voteindex/getVoteApplyList?account=" + account + "&voteId=" + id + "&page=" + page,
                type: "GET",
                success: function (result) {
                    if (result.success && result.data) {
                        appendHtml({
                            targetId: "vote-list",
                            template: "/views/front/vote/template/vote-list.html",
                            htmlData: {
                                state: window.state,
                                data: result.data
                            },
                            callBack: function () {
                                mui($("#more")[0]).button('reset');
                                if (result.page.totalPage <= page) {
                                    $("#more").attr("disabled", "disabled").text("已加载全部");
                                }
                            }
                        });
                    }
                }
            });
        }

        $("#vote-list").on("click", "span[data-id]", function () {
            var $this=$(this);
            var id = $this.attr("data-id");
            $.ajax({
                url: '/front/voteindex/voteRecordSave',
                type: 'POST',
                dataType: 'json',
                data: {"voteApplyId": id},
                success: function (result) {
                    console.log(result);
                    if (result.success) {
                        layer.msg("恭喜您,投票成功");
                        var no=parseInt($this.siblings().text());
                        no++;
                        $this.siblings().text(no);
//                        setTimeout(function () {
//                            location.reload();
//                        },1000);
                    } else {
                        layer.msg(result.msg || "投票失败");
                    }
                }
            })
        });
    });
</script>
</html>